<template>
  <div>

    <!-- 主内容区域 -->
    <el-container>
      <el-main>
        <el-row :gutter="8">
          <el-col :span="18">
            <ConnectionPanel />
          </el-col>
          <el-col :span="6">
            <LanguagePanel />
          </el-col>
        </el-row>
        <el-row :gutter="8" style="height: calc(100vh - 200px);">
          <el-col :span="9" style="height: 100%; overflow-y: auto;">
            <el-row v-if="!connectionStore.isWorkerMode">
              <el-col :span="24">
                <ProjectPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <ControllerPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <HtmlModulePanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <ToolPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <StandaloneTaskPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <ConsoleProcedurePanel />
              </el-col>
            </el-row>
            <el-row v-if="connectionStore.isBridgeMode">
              <el-col :span="24">
                <ContentTransferPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <BusChannelsPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <VideoChannelsPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <OtherChannelsPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <SystemStatusPanel />
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="9" style="height: 100%; overflow-y: auto;">
            <el-row>
              <el-col :span="24">
                <VideoMonitorPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <SignalMonitorPanel />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <BusTracer />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <BirdView />
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <PointCloudMonitor />
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="6">
            <LogPanel style="height: 100%;" />
          </el-col>
        </el-row>
      </el-main>
    </el-container>

    <!-- 对话框组件 -->
    <PageDialog />
    <InfoDialog />
    <SessionListDialog />
    <GenerationSettingDialog />
    <SessionEditorDialog />
    <PluginLibraryDialog />
    <ConfigEditorDialog />
    <GlobalValuesDialog />
    <TaskBanner />
    <TaskDetailsDialog />
    <BusMessageChooserDialog />
    <BusMessageAdderDialog />
    <SignedSignalChooserDialog />
    <SignalChooserDialog />
    <SignalAdderDialog />
    <BusProtocolChooserDialog />
    <MessageDialog />
    <ConfirmDialog />
    <InputStringDialog />
    <SingleSelectDialog />
    <MultiSelectDialog />
    <ReplayModeOptionsDialog />
    <RemoteModeOptionsDialog />

  </div>
</template>

<script setup>
import { useConnectionStore } from '@/stores/connection'
import ConnectionPanel from '@/components/panels/ConnectionPanel.vue'
import LanguagePanel from '@/components/panels/LanguagePanel.vue'
import LogPanel from '@/components/panels/LogPanel.vue'
import ProjectPanel from '@/components/panels/ProjectPanel.vue'
import ControllerPanel from '@/components/panels/ControllerPanel.vue'
import ToolPanel from '@/components/panels/ToolPanel.vue'
import StandaloneTaskPanel from '@/components/panels/StandaloneTaskPanel.vue'
import ConsoleProcedurePanel from '@/components/panels/ConsoleProcedurePanel.vue'
import HtmlModulePanel from '@/components/panels/HtmlModulePanel.vue'
import BusChannelsPanel from '@/components/panels/BusChannelsPanel.vue'
import VideoChannelsPanel from '@/components/panels/VideoChannelsPanel.vue'
import OtherChannelsPanel from '@/components/panels/OtherChannelsPanel.vue'
import SystemStatusPanel from '@/components/panels/SystemStatusPanel.vue'
import VideoMonitorPanel from '@/components/panels/VideoMonitor.vue'
import SignalMonitorPanel from '@/components/panels/SignalMonitor.vue'
import BirdView from '@/components/panels/BirdView.vue'
import BusTracer from '@/components/panels/BusTracer.vue'
import PointCloudMonitor from '@/components/panels/PointCloudMonitor.vue'
import ContentTransferPanel from '@/components/panels/ContentTransferPanel.vue'

import PageDialog from '@/components/dialogs/PageDialog.vue'
import InfoDialog from '@/components/dialogs/InfoDialog.vue'
import SessionListDialog from '@/components/dialogs/SessionListDialog.vue'
import GenerationSettingDialog from '@/components/dialogs/GenerationSettingDialog.vue'
import SessionEditorDialog from '@/components/dialogs/SessionEditorDialog.vue'
import PluginLibraryDialog from '@/components/dialogs/PluginLibraryDialog.vue'
import ConfigEditorDialog from '@/components/dialogs/ConfigEditorDialog.vue'
import GlobalValuesDialog from '@/components/dialogs/GlobalValuesDialog.vue'
import TaskBanner from '@/components/dialogs/TaskBannerDialog.vue'
import TaskDetailsDialog from '@/components/dialogs/TaskDetailsDialog.vue'
import BusMessageChooserDialog from '@/components/dialogs/BusMessageChooserDialog.vue'
import BusMessageAdderDialog from '@/components/dialogs/BusMessageAdderDialog.vue'
import SignedSignalChooserDialog from '@/components/dialogs/SignedSignalChooserDialog.vue'
import SignalChooserDialog from '@/components/dialogs/SignalChooserDialog.vue'
import SignalAdderDialog from '@/components/dialogs/SignalAdderDialog.vue'
import BusProtocolChooserDialog from '@/components/dialogs/BusProtocolChooserDialog.vue'
import MessageDialog from '@/components/dialogs/MessageDialog.vue'
import ConfirmDialog from '@/components/dialogs/ConfirmDialog.vue'
import InputStringDialog from '@/components/dialogs/InputStringDialog.vue'
import SingleSelectDialog from '@/components/dialogs/SingleSelectDialog.vue'
import MultiSelectDialog from '@/components/dialogs/MultiSelectDialog.vue'
import ReplayModeOptionsDialog from '@/components/dialogs/ReplayModeOptionsDialog.vue'
import RemoteModeOptionsDialog from '@/components/dialogs/RemoteModeOptionsDialog.vue'

const connectionStore = useConnectionStore()
</script>